<template>
	<view>
		<view class="xingming flex-between">
			<view class="">
				<u--text text="郭春香" color="#3D3D3D" size="48rpx" lineHeight="68rpx"></u--text>
				<u--text text="昵称：古话" color="#6D6D6D" size="32rpx" lineHeight="56rpx"></u--text>
				<u--text text="职聊号：123123134" color="#6D6D6D" size="32rpx" lineHeight="56rpx"></u--text>
			</view>
			<navigator url="/pages/chit-chat/data-setting/index">
				<u-avatar src="" shape="square" size="86"></u-avatar>
			</navigator>
		</view>
		<view class="notes">
			<navigator url="/pages/chit-chat/notes-and-labels/index">
				<u-cell title="设置备注和标签" :isLink="true" arrow-direction="right"></u-cell>
			</navigator>
			<u-cell title="朋友权限" :isLink="true" arrow-direction="right"></u-cell>
		</view>
		<view class="community">
			<u-cell title="社区" :isLink="true" arrow-direction="right"></u-cell>
			<u-cell title="更多" :isLink="true" arrow-direction="right"></u-cell>
		</view>
		<view class="call">
			<view class="send-message flex-justify">
				<image class="add" src="../../../static/add.png" mode=""></image>
				<text>发消息</text>
			</view>
			<view class="conversation flex-justify">
				<image class="add" src="../../../static/add.png" mode=""></image>
				<text>通话</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			};
		}
	}
</script>

<style lang="less">
	.xingming {
		padding: 50rpx 42rpx 60rpx 46rpx;
		background-color: #ffffff;
		border-bottom: 1rpx solid #D8D8D8;
	}

	.notes,
	.community {
		background-color: #ffffff;

	}

	::v-deep .notes .u-cell__body,
	::v-deep .community .u-cell__body {
		padding: 50rpx 44rpx 50rpx 46rpx;
		font-size: 36rpx;
		color: #3D3D3D;
		line-height: 50rpx;
		text-align: left;
	}

	::v-deep .notes .u-cell:nth-child(1) .u-line,
	::v-deep .community .u-cell:nth-child(1) .u-line {
		border: none !important;
		border: 2rpx solid #D8D8D8 !important;
	}

	::v-deep .notes .u-cell:nth-child(2) .u-line,
	::v-deep .community .u-cell:nth-child(2) .u-line {
		border: none !important;
	}

	::v-deep .u-icon__icon--info {
		width: 30rpx;
		height: 30rpx;
		color: #B8B8B8;
		font-size: 36rpx;
	}

	.community {
		margin: 16rpx 0rpx;
	}

	.send-message {
		border-bottom: 2rpx solid #D8D8D8;
	}

	.send-message,
	.conversation {
		height: 141rpx;
		background-color: #FFFFFF;
		column-gap: 12rpx;
	}

	.send-message image {
		width: 46rpx;
		height: 46rpx;
	}

	.conversation image {
		width: 36rpx;
		height: 36rpx;
	}

	.send-message text,
	.conversation text {
		font-weight: 400;
		font-size: 36rpx;
		color: #1872FF;
		line-height: 50rpx;
	}
</style>